<template lang="pug">
    div(class="amount-control", v-if="visible")
        div(class="header")
        div(class="body")
            div() {{title}}
            div {{subTitle}}

</template>

<script>
export default {
  name: "control-dialog",
  props: {
    visible: { type: Boolean, default: false },
    title: {type: String, default: '没有主标题'},
    subTitle: {type: String, default: '没有副标题'},
  },
  methods: {
    up() {
    
    },
    down() {
    
    },
    yes() {
     
    }
  }
};
</script>

<style lang="less" scoped>
@mainColor: #212529;
@fontColor: #eaeaea;

.amount-control {
  border: 1px solid @mainColor;
  background-color: white;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 87%;
  text-align: center;
  left: 0;
  right: 0;
  margin: auto;
  height: 55%;

  .header {
    background-color: @mainColor;
    height: 20%;
  }
  .body {
    padding: 5% 0;

    .amount {
      background-color: white;
      color: #eaeaea !important;
      width: 54%;
      margin: auto;
      text-align: center;

      i {
        font-size: 70%;
      }
    }
  }
}
</style>
